<!-- Wrapper-->
<div id="wrapper">

	<!-- Navigation -->
	<div ng-include="'views/common/navigation.html'"></div>

	<!-- Page wraper -->
	<!-- ng-class with current state name give you the ability to extended customization your view -->
	<div id="page-wrapper" class="gray-bg {{$state.current.name}}">

		<!-- Page wrapper -->
		<div ng-include="'views/common/topnavbar.html'"></div>

		<!-- Main view  -->
		<div class="row wrapper border-bottom white-bg page-heading">
			<div class="col-lg-10">
				<h2>Hello</h2>
				<ol class="breadcrumb">
					<li>
						<a href="index.html">Home</a>
					</li>
					<li class="active">
						<strong>Hello</strong>
					</li>
				</ol>
			</div>
			<div class="col-lg-2">

			</div>
		</div>

		<script type="text/ng-template" id="tree-dnd-template-render.html">
			<table ng-class="$tree_class">
				<thead>
					<tr>
						<th ng-class="expandingProperty.titleClass" ng-style="expandingProperty.titleStyle" compile="expandingProperty.titleTemplate">
							{{expandingProperty.displayName || expandingProperty.field || expandingProperty}}
						</th>
						<th ng-repeat="col in colDefinitions" ng-class="col.titleClass" ng-style="col.titleStyle" compile="col.titleTemplate">
							{{col.displayName || col.field}}
						</th>
					</tr>
				</thead>
				<tbody tree-dnd-nodes>
					<tr tree-dnd-node="node" ng-repeat="node in tree_nodes track by node.__hashKey__  " ng-show="enabledFilter ? node.__filtered_visible__ === true && node.__visible__ : node.__visible__" ng-class="enabledFilter ? (node.__filtered__ === true? 'success': '') : (node.__selected__ ? ' active':'')" ng-click="onSelect(node)">
						<td ng-style="expandingProperty.cellStyle ? expandingProperty.cellStyle : {'padding-left': $callbacks.calsIndent(node.__level__)}" ng-class="expandingProperty.cellClass" compile="expandingProperty.cellTemplate">
							<a data-nodrag> <i ng-class="node.__icon_class__" ng-click="toggleExpand(node,toggleExpandCallback(node))" class="tree-icon"></i>
							</a> {{node[expandingProperty.field] || node[expandingProperty]}}
						</td>
						<td ng-repeat="col in colDefinitions" ng-class="col.cellClass" ng-style="col.cellStyle" compile="col.cellTemplate">
							{{node[col.field]}}
						</td>
					</tr>
				</tbody>
			</table>
		</script>

		<div class="wrapper wrapper-content animated fadeInRight" ng-controller="FilterController">

			<div class="row">
				<div class="col-xs-3">

					<div class="form-group" id="data_2">
						<label class="font-normal">开始时间</label>

						<div class="input-group date">
							<input id="start_date"  type="datetime" class="form-control" ng-model="henry_date1" date-time view="year" auto-close="true">
							<span class="input-group-addon"><i class="fa fa-calendar"></i></span>
						</div>
					</div>
				</div>
				<div class="col-xs-3">

					<div class="form-group" id="data_2">
						<label class="font-normal">结束时间</label>

						<div class="input-group date">
							<input id="end_date" type="datetime" class="form-control"  date-time ng-model="henry_date2" view="year" auto-close="true">
							<span class="input-group-addon"><i class="fa fa-calendar"></i></span>
						</div>
					</div>
				</div>
			
 
				<div class="col-xs-3">
					<div class="form-group" id="data_2">
						<label class="font-normal">&nbsp;</label>
						<div class="input-group ">
							<button class="btn btn-white" ng-click="search();">search</button>
						</div>
					</div>
				</div>
				
	

			<uib-tabset>
				<!--<uib-tab heading="Outside">-->
				<div class="row">
					<!--			<div class="col-xs-2">
							<panel title="Filter for Table (Outside)">
								<div class="form-group">
									<label>Any: <input class="form-control" ng-model="_filter._$"></label>
								</div>
								<div class="form-group">
									<label>Name: <input class="form-control" ng-model="_filter.Name"></label>
								</div>
								<div class="form-group">
									<label>Description: <input class="form-control" ng-model="_filter.Description"></label>
								</div>
								<div class="form-group">
									<label>Area: <input class="form-control" ng-model="_filter.Area"></label>
								</div>
								<div class="form-group">
									<label>Population: <input class="form-control" ng-model="_filter.Population"></label>
								</div>
							</panel>
						</div>-->

					<div class="col-xs-12">
						<!--	<panel title="Table: Template Outside">-->
						<tree-dnd  tree-class="table table-bordered table-hover table-striped" tree-data="tree_data" tree-control="my_tree" filter="_filter" primary-key="DemographicId" column-defs="col_defs" expand-on="expanding_property" template-url="tree-dnd-template-render.html" indent="30" indent-plus="20" indent-unit="px" enable-hotkey="true" enable-drag="true"  enable-drop="true" enable-status="true" enable-move="true">
						</tree-dnd>
						<!--	</panel>-->
					</div>
				</div>
				<!--	</uib-tab>-->

				<div class="row" align="center">

					<div class="text-center">
						<div class="btn-group page-btn-group">
							<button class="btn btn-white" ng-click="pages.changePagePre();" type="button"><i class="fa fa-chevron-left"></i></button>
							<button ng-repeat="x in pages" ng-click="pages.changePage(x);" ng-class="{true:'btn btn-white active',false:'btn btn-white'}[x.is_select]">{{x.index}}</button>
							<button class="btn btn-white" ng-click="pages.changePageNext();" type="button"><i class="fa fa-chevron-right"></i></button>
						</div>
					</div>

				</div>
			</uib-tabset>

		</div>

		<!-- Footer -->
		<div ng-include="'views/common/footer.html'"></div>

	</div>
	<!-- End page wrapper-->

</div>
<!-- End wrapper-->